<template>
	<view class="tui-content-box">
		<view class="tui-box">
			
			<view class="withdraw-box">
				<view class="box-name">充值金额</view>
				<view class="box-input">
					<view class="ms">￥</view>
					<input placeholder-class="tui-phcolor" class="inputs" @input="inputMoney" placeholder="请输入充值金额" maxlength="11" type="text" />
				</view>
				<view class="box-notice">
					点击立即充值，代表您已同意<view @tap="treaty" class="treatys">《充值协议》</view>
				</view>
			</view>
			<view class="tui-btn-box">
				<tui-button shadow height="88rpx" shape="circle" type="warning" @click="btnSave()">立即充值</tui-button>
			</view>
			<view class="tui-btn-box">
				<tui-button shadow height="88rpx" shape="circle" type="gray" @click="rechargeList()">充值记录</tui-button>
			</view>

			
		</view>
		<view class="withdraw-txt">
			温馨提示<br>
			充值金额最少为100,充值必须为2的偶数倍！
		</view>
		
		
		
		<t-pay-ways :show="show" @close="popupClose" :total_price="money" :is_pay_cost="is_pay_cost" :iswx="iswx" :recharge_type="recharge_type"></t-pay-ways>
	</view>
	
</template>

<script>
	import tPayWays from "@/components/views/t-pay-ways/ti-pay-ways"
	export default {
		components: {
			tPayWays
		},
		data() {
			return {
				money: '',
				msg: null,
				index: 0,
				pay_type:1,
				show:false,
				is_pay_cost:'0',
				iswx:false,
	            recharge_type:'1',
			}
		},
		onShow() {
			
			this.tui.haslogin();
			if(this.tui.isLogin()){
				this.init();
			}
		},

		methods: {
			init(){
				// #ifdef H5
				// let ua = window.navigator.userAgent.toLowerCase()
				// if (ua.match(/MicroMessenger/i) == 'micromessenger') {
				// 	this.iswx=true;
				// }
				//#endif
			},
		    bindPickerChange: function(e) {
				
			   this.index = e.detail.value;
			   this.recharge_type=this.index+1;
		    },
			inputMoney: function(e) {
				this.money = e.detail.value;
			},
			rechargeList:function(){
				uni.navigateTo({
					url: '../user/rechargeList'
				});
			},
			onlines:function(){
				uni.navigateTo({
					url: '../user/onlines'
				});
			},
            btnSave() {
				//this.tui.toast('正在升级中');return;
				if(this.money<=0){
					this.tui.toast('充值金额不能为空');
					return;
				}
				this.show = true;
			},
			popupClose() {
				this.show = false
			},
			treaty(){
				
			}
			
		}
	}
</script>

<style>
	page {
		background-color: #F5F5F5;
	}

	.tui-content-box {
		width: 100%;
		padding: 0 30rpx;
		box-sizing: border-box;
		position: relative;
		/* 	top: -72rpx; */
		z-index: 10;
	}
    .activity-img{width:100%;margin-top: 40rpx;}
	.tui-box {
		/* 	width: 100%; */
		margin-top: 30rpx;
		background: #fff;
		padding: 36rpx;
		box-shadow: 0 3rpx 20rpx rgba(183, 183, 183, 0.1);
		border-radius: 10rpx;
		overflow: hidden;
	}
    .input-select{font-size: 30rpx;color:#858680}
	.tui-btn-box {
		margin-bottom: 20rpx;
	}
	.treatys{
		color:#ffad10;
	}
    .tui-cell_ft_in-access:after {
		content: ' ';
		height: 11px;
		width: 11px;
		border-width: 2px 2px 0 0;
		border-color: #b2b2b2;
		border-style: solid;
		-webkit-transform: matrix(0.5, 0.5, -0.5, 0.5, 0, 0);
		transform: matrix(0.5, 0.5, -0.5, 0.5, 0, 0);
		position: absolute;
		top: 50%;
		margin-top: -7px;
		right: 2px;
	}
	.withdraw-account {
		display: flex;
		box-sizing: border-box;
		align-items: center;
		padding: 10rpx;
		justify-content: center;
		background: #eaeaea;
		height: 100rpx;
		border-radius: 10rpx;
		text-align: center;
		line-height: 100rpx;
		color: #4e4d4d;
	}

	.withdraw-account-h1 {
		color: #4e4d4d;
		font-weight: bold;
		display: flex;
		box-sizing: border-box;
		align-items: center;
		justify-content: center;
		font-size: 30rpx;
	}

	.withdraw-box {
		margin-top: 40rpx;
	}

	.box-name {
		font-size: 26rpx;
		color: #3e3e3e;
	}

	.box-input {
		border-bottom: 1rpx solid #f3f2f2;
		display: flex;
		height: 100rpx;
		align-items: center;
		padding: 10rpx;
		margin-bottom: 30rpx;
		justify-content: left;
		font-size: 60rpx;
		position: relative;
	}

	.box-input .ms {}

	.box-input .inputs {
		font-size: 60rpx;
	}

	.box-notice {
		font-size: 20rpx;
		color: #8e8d8d;
		display: flex;
		box-sizing: border-box;
		align-items: center;
		justify-content: left;
		margin-bottom: 60rpx;
	}

	.withdraw-nums {
		color: #f23030;
		display: inline;
	}

	.withdraw-txt {
		margin-top: 40rpx;
		margin-left: 20rpx;
		color: #bbb9b0;
		font-size: 22rpx;
		line-height: 44rpx;
	}
</style>
